<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
    <%@taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
     <%@taglib uri="http://struts.apache.org/tags-nested" prefix="nested" %>
     <%@taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
     <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
    
<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="/OnOffLine/js/external/jquery-1.7.1.js"></script>
<script type="text/javascript" src="/OnOffLine/js/offline.js"></script>
<script type="text/javascript" src="/OnOffLine/js/db.js"></script>
<title>Create</title>
<link rel="stylesheet" type="text/css" href="/OnOffLine/css/style.css" />
</head>

<body>

<div class="top-menu">
	<div class="left-item"><a href="/OnOffLine/">OnOffLine</a></div>
		
	<div class="right-item">		
		<div class="center-block"><a id="createtop" title="Create new note" href="/OnOffLine/blog.do?method=create"><img alt="create new note" src="/OnOffLine/images/mail.png" /></a><a class="createtop_offline x-hidden" href="/OnOffLine/jsp/create.jsp"></a></div>
		<div class="right-block"><a href="#">sign out</a></div>
	</div>
</div>

<div class="main">

	<div class="left">
		<img class="logo" src="/OnOffLine/images/logo2.png" alt="logo" />
		<img class="ico-pencil" src="/OnOffLine/images/pencil.png" alt="logo" />
			 
		<ul class="left-menu">
			<li><a id="myblogs" class="link" href="/OnOffLine/blog.do?method=myBlogs">my notes</a></li>
			<li class="active"><a id="create" class="link" href="/OnOffLine/blog.do?method=create">create</a></li>
		</ul>
	</div>
	
	<div class="right">
	
		<div id="create_form" class="inner">
			<h3>CREATE</h3>

			<html:form action="blog.do?method=save" method="post">
			
			<div class="formRow">
			<label>Title <span>*</span></label>
			<html:text styleClass="txt" name="blogForm" property="blogOne.title"></html:text>
			</div>
			
			<div class="formRow">
			<label>Note <span>*</span></label>
			<html:textarea name="blogForm" property="blogOne.description"></html:textarea>
			</div>
			
			<div class="formRow">
			<input class="button blue" type="submit" value="Save" />
			<a class="button black" href="blog.do?method=myBlogs">Cancel</a>
			</div>
			
			<input type="hidden" name="destination" value="/OnOffLine/jsp/my_blogs.jsp" />
			<input type="hidden" name="id" value="" />
			
			</html:form>
			
		</div>
	</div>
</div>

<div class="footer">&#169; 2012 OnOffLine. All rights reserved</div>

<script type="text/javascript">
$(function(){
	
	function isUpdate(){
		return $('form').find('input[name=id]').val();
	}
	
	var hash = window.location.hash;
	var id = hash.substr(-1);
	
	$('form').submit(function(){
		
		if (isUpdate())
		{
			updateBlog(id, $(this).find('input[name=title]').val(), $(this).find('textarea').val(), function(){
				if (!isOnline()){
					window.location.href = $('#create_form form').find('input[name=destination]').val();
				}
			});
		}
		else
		{		
			insertBlog($(this).find('input[name=title]').val(), $(this).find('textarea').val(), function(){
				if (!isOnline()){
					window.location.href = $('#create_form form').find('input[name=destination]').val();
				}
			});
		}
	});
});
</script>

</body>
</html>